function getLineOption(dataX,dataY){
	var lineOption = {
			color:["#00a9e1","#0046af","#360293"],
	    tooltip: {
//	      trigger: 'axis',
//	      axisPointer: {
//	          type: 'cross',
//	          crossStyle: {
//	              color: '#999'
//	          }
//	      }
	    },
	    grid: {
	    	top: 5,
	    	left: 70,
	    	right:30,
	    	bottom:30
	    },
	    toolbox: {
	    	show:false,
	        feature: {
	            dataView: {show: true, readOnly: false},
	            magicType: {show: true, type: ['line', 'bar']},
	            restore: {show: true},
	            saveAsImage: {show: true}
	        }
	    },
	    legend: {
	    	show:false,
	    	textStyle:{
	    		color:'#fff'
	    	},
	        //data:['蒸发量','降水量','平均温度']
	    },
	    xAxis: [
	        {
	          type: 'category',
	          boundaryGap: false,
	          data: dataX,
	          axisPointer: {
	              type: 'shadow'
	          },
	          axisLabel:{
	          	color:'#c0d4da',
	          	//rotate : 60,
	          },
		        axisLine:{
		        	show:true,
		        	lineStyle:{
		        		color:'#c0d4da'
		        	}
		        }
	        }
	    ],
	    yAxis: [
	        {
	          type: 'value',
	          //name: '单位',
	          //min: 5,
	          //max: 6,
	          //interval: 50,
	          axisLabel: {
	            color:'#c0d4da'
	          },
	          axisLine:{
		        	show:true,
		        	lineStyle:{
		        		color:'#c0d4da'
		        	}
	        	},
	        	splitLine:{
	        		lineStyle:{
		        		color:'#272858'
		        	}
	        	}
	        }
	    ],
	    series:[
	        {
	            name:'事件传播报道篇数',
	            type:'line',
	            symbol: 'circle',
	            smooth: true,
	            barWidth:'25%',
	            data:dataY
	        }
	    ]
	};
	return lineOption;
}
//折线图
var dataY = [0,50,8,40,120,4];
var dataX = ['2018-01-09 00时','2018-01-09 17时','2018-01-10 02时','2018-01-11 14时','2018-01-12 08时','2018-01-13 02时'];
var lineChart = echarts.init(document.getElementById('ec_bar'))
lineChart.setOption(getLineOption(dataX,dataY));

//地图
var mapData=[
	{name:'河北',value:4.4},
	{name:'山东',value:5.0},
	{name:'河南',value:5.0},
	{name:'安徽',value:5.5},
	{name:'四川',value:6.1},
	{name:'江苏',value:6.6},
	{name:'上海',value:6.6},
	{name:'广东',value:8.3},
	{name:'北京',value:15.5}
]

var geoCoordMap={}
var mapFeatures = echarts.getMap('china').geoJson.features;
mapFeatures.forEach(function(v) {
    // 地区名称
    var name = v.properties.name;
    // 地区经纬度
    geoCoordMap[name] = v.properties.cp;
});
var convertData = function (data) {
    var res = [];
    for (var i = 0; i < data.length; i++) {
        var geoCoord = geoCoordMap[data[i].name];
        if (geoCoord) {
            res.push({
                name: data[i].name,
                value: geoCoord.concat(data[i].value)
            });
        }
    }
    return res;
};
function getOptionMap(mapData,max){
	var optionMap = {
			tooltip : {
				trigger : 'item',
				formatter : function(param) {
					// console.log(param)
					if(param.name!=''){
						return '<div>' + param.name + '</div>' + 
							'<div>占比：'+ param.data.value[2] + '%</div>';
					}
				}
			},
			geo : {
				show : true,
				zoom : 1.2,
				roam : false,
				map : 'china',
				itemStyle : {
					normal : {
						show : false,
						borderColor : '#285ac6',
						borderWidth : 1,
						areaColor : '#123082',
						shadowBlur : 3,
						shadowColor : '#081435',
						shadowOffsetX : -4,
						shadowOffsetY : 8
					},
					emphasis : {
						areaColor : '#fce24f',
						borderColor : '#fce24f'
					}
				}
			},
			series : [ {
				type : 'map',
				zoom : 1.2,
				mapType : 'china',
				// geoIndex: 0,
				roam : false,
				label : {
					normal : {
						show : false,
						textStyle : {
							color : '#fff'
						}
					},
					emphasis : {
						show : true,
						textStyle : {
							color : '#fff'
						}
					}
				},
				itemStyle : {
					normal : {
						show : false,
						borderColor : '#3770ea',
						borderWidth : 1,
						areaColor : '#0f2d87'
					},
					emphasis : {
						areaColor : '#2a56bd',
						borderColor : '#2a56bd',
					// opacity: 0.8,
					}
				},
				data : convertData(mapData)
			}, {
				name : 'Top 5',
				type : 'effectScatter',
				zlevel : 1,
				coordinateSystem : 'geo',
				symbolSize : function(val) {
					return val[2] / max * 15 + 5
				},
				showEffectOn : 'render',
				rippleEffect : {
					brushType : 'stroke'
				},
				hoverAnimation : true,
				label : {
					normal : {
						// formatter: '{b}',
						position : 'right',
						show : false
					}
				},
				itemStyle : {
					normal : {
						color : '#f4e925',
						shadowBlur : 10,
						shadowColor : '#333'
					}
				},
				// data: convertData(mapData)
				data : convertData(mapData.sort(function(a, b) {
					return b.value - a.value
				}).slice(0, 9))
			}, {
				name : 'Top 5',
				type : 'scatter',
				zlevel : 1,
				coordinateSystem : 'geo',
				symbolSize : function(val) {
					return val[2] / max * 15 
				},
				showEffectOn : 'render',
				rippleEffect : {
					brushType : 'stroke'
				},
				hoverAnimation : true,
				label : {
					normal : {
						// formatter: '{b}',
						position : 'right',
						show : false
					}
				},
				itemStyle : {
					normal : {
						color : '#f4e925',
						shadowBlur : 10,
						shadowColor : '#333'
					}
				},
				// data: convertData(mapData)
				data : convertData(mapData.sort(function(a, b) {
					return b.value - a.value;
				}).slice(5))
			} ]
	};
	return optionMap;
}

var mapChart = echarts.init(document.getElementById('ec_map'))
mapChart.setOption(getOptionMap(mapData,15))

//柱状图统计
var yData=['河北','山东','河南','安徽','四川','江苏','上海','广东','北京']
var xData=[4.4,5.0,5.0,5.5,6.1,6.6,6.6,8.3,15.5]

var maxDataAll=function(data){
	
}
var barOption=function(xData,yData){
	var sum=0;
	var allData=[];
	for(var i=0;i<xData.length;i++){
		sum+=xData[i]
	}
	for(var i=0;i<yData.length;i++){
		allData.push(sum)
	}
	console.log(allData)
	
  var barOption={
  	grid: {
      left:40,
      top: 0,
      right:10,
      bottom:0
  },
  xAxis: {
      splitLine:{    //grid区域分隔线
          show:false,
          lineStyle: {
              width:1,
              type:"solid",
              color:"#2a3f7e"
          }
      },
      axisLabel: {  //坐标轴标签
          show: false,
          textStyle: {
              color: '#c0d4da'
          },
          interval:false,
          rotate : 25,
      },
      axisTick: {
          show: false,   //刻度线
          color:"#c0d4da"
      },
      axisLine:{
          show: false,   //坐标轴轴线
          lineStyle: {
              width:1,
              color:"#c0d4da"
          }
      }
  },
  yAxis : {
      type: 'category',
      splitLine:{    //grid区域分隔线
          show:false,
          lineStyle: {
              width:1,
              type:"solid",
              color:"#2a3f7e"
          }
      },
      axisTick: {
          show: false,   //刻度线
          color:'#c0d4da'
      },
      axisLine: {
          show: false ,  //坐标轴轴线
          lineStyle: {
              width:1,
              color:"#c0d4da"
          }
      },
      axisLabel: {  //坐标轴标签
          show: true
      },
      data: yData
  },
  series: [{
            name: '外侧',
            type: 'bar',
            z: 1,
            barGap: '-100%',
            itemStyle: {
                normal: {
                    color: '#1d3fa1',
                   // borderWidth: 1,
                    barBorderRadius:35,
                 //   borderColor: '#0ea4e3'
                },
                emphasis: {
                	color: '#1d3fa1',
                }
            },
            data: allData
        }, {
            type: 'bar',
            barGap: '-100%',
            barCategoryGap:'70%',
					  tooltip: {
					      trigger: 'none',
					      axisPointer: {
					          type: 'shadow',
					      }
					  },
            itemStyle: {
                normal: {
                  color: '#0ea4e3',
                  barBorderRadius:35,
                }
            },
            label: {
                normal: {
                    show: true,
                    color: '#fff',
                    position: 'right',
                    //百分比格式
                    formatter: function(param) {
//                  	console.log(param)
                      //return parseInt(param.value/sum(xData)*100)+'%'
                    	return (param.value/sum*100).toFixed(1)+'%'
                    },
                }
            },
            data: xData
        }]
  }
	return barOption
}
var barChart = echarts.init(document.getElementById('ecBarTh'))
barChart.setOption(barOption(xData,yData))

//饼图

var dataAll=[
	{name:'微博',value:827},
	{name:'网媒',value:401}
]

var pieOption = function(data){
	var pieOption={
		color : ["#ffe34e",  "#93dd6e", "#ff8700","#00a9e1","#0046af","#360293","#560081","#af0058", "#ff8700", "#ffe34e", "#93dd6e"],
    title : {
    	show:false,
	    text: '某站点用户访问来源',
	    subtext: '纯属虚构',
	    x:'center'
    },
    tooltip : {
        trigger: 'item',
        formatter: "{a} <br/>{b} : {c} ({d}%)"
    },
    legend: {
    	show:false,
    		top:'top',
    		right:'5%',
    		textStyle:{
    			color: 'rgba(255,255,255,0.8)'
    		},
        orient: 'vertical',
        data: legendData(data)
    },
    series : [
        {
          name: '',
          type: 'pie',
          radius : '65%',
          center: ['43%', '50%'],
          data: data,
          itemStyle: {
              normal:{
                  label:{
                      color:'#fff',
                  }
              },
              emphasis: {
                  shadowBlur: 10,
                  shadowOffsetX: 0,
                  shadowColor: 'rgba(0, 0, 0, 0.5)'
              }
          }
        }
    ]
	}
	return pieOption
}

function legendData(data){
	var arr=[];
	for(var i=0;i<data.length;i++){
		arr.push(data[i].name)
	}
	return arr
}

var pieMiddleChart = echarts.init(document.getElementById('ec_pie_middle'))
pieMiddleChart.setOption(pieOption(dataAll));

$('#mySelect').change(function(){
	var n = $(this).val();
	var pieData = null;
	var dataX = null;
	var dataY = null;
	var yData = null;
	var xData = null;
	var allData = null;
	var mapData = null;
	var mapMax = 0;
	if(n == 0){//万豪将港澳台及西藏列为“国家”
		dataY = [0,50,8,40,120,4];
		dataX = ['2018-01-09 00时','2018-01-09 17时','2018-01-10 02时','2018-01-11 14时','2018-01-12 08时','2018-01-13 02时'];
		pieData = [
			{name:'网媒',value:564},
			{name:'微博',value:990}
		];
		var yData=['河北','山东','河南','安徽','四川','江苏','上海','广东','北京']
		var xData=[4.4,5.0,5.0,5.5,6.1,6.6,6.6,8.3,15.5]
//		var max = sum(xData)
		mapData=[
			{name:'河北',value:4.4},
			{name:'山东',value:5.0},
			{name:'河南',value:5.0},
			{name:'安徽',value:5.5},
			{name:'四川',value:6.1},
			{name:'江苏',value:6.6},
			{name:'上海',value:6.6},
			{name:'广东',value:8.3},
			{name:'北京',value:15.5}
		]
		mapMax = 15;
	}else if(n == 1){//北京市网信办约谈新浪微博：热搜榜等模块被下线整改
		dataY = [3,180,0,60,64,28,15,0]
		dataX = ['2018-01-27 00时','2018-01-27 17时','2018-01-28 04时','2018-01-28 18时','2018-01-29 08时','2018-01-29 22时','2018-01-30 12时','2018-01-31 02时']
		pieData = [
			{name:'网媒',value:911},
			{name:'微博',value:305}
		];
		yData=['辽宁','陕西','山东','重庆','河南','河北','广东','四川','北京'];
		xData=[4.2,4.8,4.8,4.8,5.5,5.5,6.1,10.3,13.9];
//		var max = sum(xData)
		mapData =[
			{name:'辽宁',value:4.2},
			{name:'陕西',value:4.8},
			{name:'山东',value:4.8},
			{name:'重庆',value:4.8},
			{name:'河南',value:5.5},
			{name:'河北',value:5.5},
			{name:'广东',value:6.1},
			{name:'四川',value:10.3},
			{name:'北京',value:13.9}
		];
		mapMax = 13;
	}else if(n == 2){//中共中央、国务院发出《关于开展扫黑除恶专项斗争的通知》
		dataY = [0,100,60,170,40,29,15,62,0]
		dataX = ['2018-01-24 06时','2018-01-24 17时','2018-01-25 12时','2018-01-25 17时','2018-01-26 18时','2018-01-28 00时','2018-01-29 06时','2018-01-30 12时','2018-01-30 00时']
		pieData = [
			{name:'网媒',value:421},
			{name:'微博',value:468}
		];
		yData=['浙江','河北','上海','陕西','四川','江苏','山东','广东','河南'];
		xData=[4.2,4.6,4.6,5.1,6.0,7.4,7.6,7.9,9.4];
//		var max = sum(xData)
		mapData = [
			{name:'浙江',value:4.2},
			{name:'河北',value:4.6},
			{name:'上海',value:4.6},
			{name:'陕西',value:5.1},
			{name:'四川',value:6.0},
			{name:'江苏',value:7.4},
			{name:'山东',value:7.6},
			{name:'广东',value:7.9},
			{name:'河南',value:9.4}
		];
		mapMax = 9;
	}else if(n == 3){//《中国共产党中央委员会关于修改宪法部分内容的建议》公布
		dataY = [15,180,90,60,90,30,0]
		dataX = ['2018-02-25 00时','2018-02-25 18时','2018-02-26 08时','2018-02-26 12时','2018-02-26 16时','2018-02-27 00时','2018-02-28 00时']
		pieData = [
			{name:'网媒',value:627},
			{name:'微博',value:288}
		];
		yData=['山东','浙江','湖北','陕西','辽宁','江苏','广东','上海','北京'];
		xData=[3.2,3.2,3.6,3.6,4.1,6.3,6.8,8.1,32.6];
//		var max = sum(xData)
		mapData = [
			{name:'山东',value:3.2},
			{name:'浙江',value:3.2},
			{name:'湖北',value:3.6},
			{name:'陕西',value:3.6},
			{name:'辽宁',value:4.1},
			{name:'江苏',value:6.3},
			{name:'广东',value:6.8},
			{name:'上海',value:8.1},
			{name:'北京',value:32.6}
		];
		mapMax = 32;
	}else if(n == 4){//两会
		dataY = [0,40,200,900,210,180,2500,800]
		dataX = ['2018-02-27 00时','2018-02-28 06时','2018-03-01 12时','2018-03-02 18时','2018-03-04 00时','2018-03-05 06时','2018-03-05 12时','2018-03-06 12时']
		pieData = [
			{name:'网媒',value:30124},
			{name:'微博',value:15647}
		];
		yData=['湖北','陕西','上海','山东','江苏','河南','广东','四川','北京'];
		xData=[3.5,4.0,4.4,4.5,6.3,7.3,8.9,11.6,14.7];
//		var max = sum(xData)
		mapData = [
			{name:'湖北',value:3.5},
			{name:'陕西',value:4.0},
			{name:'上海',value:4.4},
			{name:'山东',value:4.5},
			{name:'江苏',value:6.3},
			{name:'河南',value:7.3},
			{name:'广东',value:8.9},
			{name:'四川',value:11.6},
			{name:'北京',value:14.7}
		];
		mapMax = 14;
	}
	pieMiddleChart.setOption(pieOption(pieData));
	lineChart.setOption(getLineOption(dataX,dataY));
	barChart.setOption(barOption(xData,yData));
	mapChart.setOption(getOptionMap(mapData,mapMax))
});

window.addEventListener('resize',function(){
	lineChart.resize();
//	pieLeftChart.resize();
	pieMiddleChart.resize();
//	pieRightChart.resize();
	mapChart.resize();
	barChart.resize()
})